<%--
  Created by IntelliJ IDEA.
  User: xdzy
  Date: 2017/4/10
  Time: 21:12
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib  uri="/struts-tags" prefix="s" %>
<!DOCTYPE html>
<html class="no-js fixed-layout">
<head>
    <base href="<%=basePath%>">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>我的资料</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <link rel="stylesheet" href="./resources/css/amazeui.min.css"/>
    <link rel="stylesheet" href="./resources/css/admin.css">
    <link rel="stylesheet" href="./resources/css/style.css">
    <script type="text/javascript" src="resources/js/jquery-3.1.0.min.js"></script>

</head>

<body>
<jsp:include page="common1.jsp"/>
<div class="am-cf am-padding">
    <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">编辑资料</strong></div>
</div>
<div class="am-g">
    <div class="am-u-sm-12 am-u-md-11">
        <div class="am-panel am-panel-default">
            <div class="am-panel-bd">
                    <s:form cssClass="am-form am-form-horizontal" namespace="/" action="./user/user_update.action" method="post"  enctype="multipart/form-data">
                        <div class="am-g">
                        <div class="am-u-sm-12 am-u-md-4 am-u-md-push-8">
                        <div class="am-panel am-panel-default">
                        <div class="am-panel-bd">
                        <div class="am-g">
                        <div class="am-u-md-4">
                        <img id="imgs" class="am-img-circle am-img-thumbnail" src="./resources/images/${requestScope.myinfo.headImg}" alt=""/>
                        </div>
                        <div class="am-u-md-8">
                        <p>上传一个新头像吧 </p>
                        <%--<form class="am-form">--%>
                        <div class="am-form-group">
                            <input type="file" name="logoUploadFile" id="file1"  style="display:none;">
                        <p class="am-form-help">请选择要上传的文件...</p>
                        <button type="button" class="am-btn am-btn-primary am-btn-xs" onclick="s();">选择</button>
                        </div>
                        <%--</form>--%>
                        </div>
                        </div>
                        </div>
                        </div>
                        </div>
                            <s:hidden name="uid" value="%{model.uid}"></s:hidden>
                            <s:hidden name="password" value="%{model.password}"></s:hidden>
                            <s:hidden name="username" value="%{model.username}"></s:hidden>
                        <div class="am-u-sm-12 am-u-md-8 am-u-md-pull-4">
                        <%--<form class="">--%>
                        <div class="am-form-group">
                        <label for="user-name" class="am-u-sm-3 am-form-label">昵称</label>
                        <div class="am-u-sm-9">
                            <s:textfield id="user-name" name="nickName" value="%{model.nickName}"></s:textfield>
                        </div>
                        </div>
                        <div class="am-form-group">
                            <label for="sex" class="am-u-sm-3 am-form-label">性别</label>
                            <div class="am-u-sm-9">
                                <s:select list="#{1:'男',0:'女'}" name="sex" listKey="key" listValue="value" value="%{model.sex}" />
                            </div>
                        </div>
                            <div class="am-form-group">
                                <label for="birth" class="am-u-sm-3 am-form-label">生日</label>
                                <div class="am-u-sm-9">
                                    <input type="date" id="birth" name="birthday" value="<s:date name="model.birthday" format="yyyy-MM-dd" />"/>
                                </div>
                            </div>
                        <div class="am-form-group">
                        <label for="user-email" class="am-u-sm-3 am-form-label">电子邮件 / Email</label>
                        <div class="am-u-sm-9">
                            <s:textfield id="user-email" name="email" value="%{model.email}"></s:textfield>
                        </div>
                        </div>

                        <div class="am-form-group">
                        <label for="user-intro" class="am-u-sm-3 am-form-label">简介 / Intro</label>
                        <div class="am-u-sm-9">
                        <textarea class="" rows="5" name="detail" id="user-intro" placeholder="输入个人简介"><s:property value="%{model.detail}"/></textarea>
                        </div>
                        </div>

                        <div class="am-form-group">
                        <div class="am-u-sm-9 am-u-sm-push-3">

                        </div>
                        </div>
                        <%--</form>--%>
                        </div><button type="submit" class="am-btn am-btn-primary">保存修改</button>
                    </s:form>
            </div>
        </div>
    </div>
</div>
</div>


<jsp:include page="common2.jsp" />
<script type="text/javascript">

    function s()
    {
        document.getElementById("file1").click();
    }
    //	function d()	{
    //var windowURL=window.URL||window.webkitURL;
    //var v=windowURL.createObjectURL($('input[type="file"]'));

    //  var v=$('input[type="file"]').val();

    //$("#imgs").attr('src',v)
    //	}
    var
        fileInput = document.getElementById('file1'),
        info = document.getElementById('test-file-info'),
        preview = document.getElementById('imgs');
    // 监听change事件:
    fileInput.addEventListener('change', function () {
        // 清除背景图片:
        preview.style.backgroundImage = '';
        // 检查文件是否选择:
        if (!fileInput.value) {
            info.innerHTML = '没有选择文件';
            return;
        }
        // 获取File引用:
        var file = fileInput.files[0];
        // 获取File信息:
//        info.innerHTML = '文件: ' + file.name + '<br>' +
//            '大小: ' + file.size + '<br>' +
//            '修改: ' + file.lastModifiedDate;
        if (file.type !== 'image/jpeg' && file.type !== 'image/png' && file.type !== 'image/gif') {
            alert('不是有效的图片文件!');
            return;
        }
        // 读取文件:
        var reader = new FileReader();
        reader.onload = function(e) {
            $("#test-image-preview").css("display","")
            var
                data = e.target.result; // '...(base64编码)...'
            preview.src =data;
        };
        // 以DataURL的形式读取文件:
        reader.readAsDataURL(file);
    });
</script>
</body>
</html>
                             